import { reactive, onMounted } from 'vue'
import axios from 'axios'

export default function() {
  // dog图片：https://dog.ceo/api/breed/pembroke/images/random
  let dogList = reactive([
    'https://images.dog.ceo/breeds/pembroke/n02113023_6275.jpg'
  ])
  // 方法
  async function getDog() {
    try {
      let result = await axios.get('https://dog.ceo/api/breed/pembroke/images/random')
      console.log(result.data.message)
      dogList.push(result.data.message)
    } catch (error) {
      alert('获取狗狗图片失败:' + error)
      // axios 拦截器也可以
    }
  }

  // 钩子
  onMounted(() => {
    getDog()
  })

  // 向外部提供东西
  return {
    dogList,
    getDog
  }
}